﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}
<link href="~/scripts/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
<style>
    .form-container {
        padding: 20px;
    }

    .layui-form-item {
        margin-bottom: 15px;
    }

    .button-group {
        text-align: center;
        margin-top: 30px;
    }
</style>
<body>
    <div class="form-container">
        <form class="layui-form" id="updateForm" lay-filter="updateForm">
            @Html.AntiForgeryToken()
            <!-- 隐藏的ID字段 -->
            <input type="hidden" name="Id" id="recordId" />
            <!-- 隐藏的IsNo字段 -->
            <input type="hidden" name="IsNo" id="isNo" />
            
            <div class="layui-row">
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>发料单编号:</label>
                        <div class="layui-input-block">
                            <div style="display: flex; align-items: center;">
                                <input type="text" name="IssuingCode" placeholder="请输入发料单编号" autocomplete="off" class="layui-input" lay-verify="required" style="flex: 1; margin-right: 10px;">
                                <div class="layui-form-mid layui-word-aux">
                                    <input type="checkbox" id="autoGenerate" title="自动生成" lay-skin="primary">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>发料单名称:</label>
                        <div class="layui-input-block">
                            <input type="text" name="IssuingName" placeholder="请输入发料单名称" autocomplete="off" class="layui-input" lay-verify="required">
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-row">
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">发料日期:</label>
                        <div class="layui-input-block">
                            <input type="text" name="IssuingDate" id="issuingDate" placeholder="请选择发料日期" autocomplete="off" class="layui-input" readonly>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">发料仓库:</label>
                        <div class="layui-input-block">
                            <select name="WarehouseCode" lay-search>
                                <option value="">请选择</option>
                                <option value="WH001">原材料仓库</option>
                                <option value="WH002">成品仓库</option>
                                <option value="WH003">半成品仓库</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-row">
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">单据状态:</label>
                        <div class="layui-input-block">
                            <select name="State" disabled>
                                <option value="0">草稿</option>
                                <option value="1">待审核</option>
                                <option value="2">已审核</option>
                                <option value="3">已发料</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>外协工单:</label>
                        <div class="layui-input-block">
                            <div style="display: flex; align-items: center;">
                                <input type="text" name="OrderCode" placeholder="请输入或选择外协工单" autocomplete="off" class="layui-input" lay-verify="required" style="flex: 1; margin-right: 10px;">
                                <div class="layui-form-mid layui-word-aux">
                                    <i class="layui-icon layui-icon-search" onclick="selectOrder()" style="cursor: pointer; font-size: 18px; color: #009688;" title="选择外协工单"></i>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-row">
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">供应商:</label>
                        <div class="layui-input-block">
                            <input type="text" name="SupplierCode" placeholder="请输入供应商编码" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">备注:</label>
                <div class="layui-input-block">
                    <textarea name="Context" placeholder="请输入内容" class="layui-textarea"></textarea>
                </div>
            </div>

            <div class="button-group">
                <button class="layui-btn" lay-submit lay-filter="updateBtn">更新</button>
                <button type="button" class="layui-btn layui-btn-primary" onclick="closeDialog()">取消</button>
            </div>
        </form>
    </div>
</body>
<script src="~/scripts/jquery-3.4.1.min.js"></script>
<script src="~/scripts/layui-v2.5.6/layui/layui.js"></script>
<script>
    layui.use(['form', 'laydate', 'layer'], function(){
        var form = layui.form;
        var laydate = layui.laydate;
        var layer = layui.layer;

        // 初始化日期选择器
        laydate.render({
            elem: '#issuingDate',
            format: 'yyyy-MM-dd'
        });

        // 页面加载时获取数据并反填
        $(document).ready(function() {
            // 获取URL参数中的id
            var urlParams = new URLSearchParams(window.location.search);
            var id = urlParams.get('id');
            
            if (id) {
                loadDataForEdit(id);
            }
        });

        // 加载数据进行反填
        function loadDataForEdit(id) {
            var loadingIndex = layer.load(1, {
                shade: [0.3, '#000']
            });

            $.ajax({
                url: '/Warehousings/FindIssuingMaterials',
                type: 'GET',
                data: { id: id },
                success: function(result) {
                    layer.close(loadingIndex);
                    
                    if (result && result.length > 0) {
                        var data = result[0]; // 取第一个结果
                        
                        // 反填表单数据
                        $('#recordId').val(data.id);
                        $('#isNo').val(data.isNo || 0);
                        $('input[name="IssuingCode"]').val(data.issuingCode || '');
                        $('input[name="IssuingName"]').val(data.issuingName || '');
                        $('input[name="OrderCode"]').val(data.orderCode || '');
                        $('input[name="SupplierCode"]').val(data.supplierCode || '');
                        $('textarea[name="Context"]').val(data.context || '');
                        
                        // 设置发料日期
                        if (data.issuingDate) {
                            var date = new Date(data.issuingDate);
                            var formattedDate = date.getFullYear() + '-' + 
                                String(date.getMonth() + 1).padStart(2, '0') + '-' + 
                                String(date.getDate()).padStart(2, '0');
                            $('input[name="IssuingDate"]').val(formattedDate);
                        }
                        
                        // 设置仓库下拉框
                        $('select[name="WarehouseCode"]').val(data.warehouseCode || '');
                        
                        // 设置状态下拉框
                        $('select[name="State"]').val(data.state || 0);
                        
                        // 重新渲染表单组件
                        form.render();
                    } else {
                        layer.msg('未找到相关数据', {icon: 2});
                    }
                },
                error: function() {
                    layer.close(loadingIndex);
                    layer.msg('加载数据失败', {icon: 2});
                }
            });
        }

        // 自动生成编号功能
        form.on('checkbox', function(data){
            if(data.elem.id === 'autoGenerate' && data.elem.checked) {
                // 生成时间戳编号
                var timestamp = new Date().getTime();
                $('input[name="IssuingCode"]').val('FL' + timestamp);
            } else if(data.elem.id === 'autoGenerate') {
                $('input[name="IssuingCode"]').val('');
            }
        });

        // 表单提交
        form.on('submit(updateBtn)', function(data){
            var formData = data.field;

            // 处理日期格式
            if(formData.IssuingDate) {
                formData.IssuingDate = new Date(formData.IssuingDate).toISOString();
            }

            // IsNo值将从隐藏字段自动获取

            // 发送更新请求
            $.ajax({
                url: '/Warehousings/UpdateIssuingMaterials',
                type: 'POST',
                data: formData,
                headers: {
                    'RequestVerificationToken': $('input[name="__RequestVerificationToken"]').val()
                },
                success: function(result) {
                    if(result === 1) {
                        layer.msg('更新成功', {icon: 1});
                        setTimeout(function(){
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                            // 调用父页面的更新单行方法，避免整个表格重新加载
                            if(parent.updateSingleRow) {
                                parent.updateSingleRow($('#recordId').val(), formData);
                            } else if(parent.refreshTable) {
                                // 如果没有单行更新方法，则刷新整个表格
                                parent.refreshTable();
                            }
                        }, 1000);
                    } else {
                        layer.msg('更新失败', {icon: 2});
                    }
                },
                error: function() {
                    layer.msg('网络错误，请重试', {icon: 2});
                }
            });

            return false; // 阻止表单跳转
        });

        // 选择外协工单
        window.selectOrder = function() {
            layer.open({
                type: 2,
                title: '工单选择',
                shadeClose: false,
                shade: 0.8,
                area: ['80%', '70%'],
                content: '/Warehousings/WorkOrderView'
            });
        };

        // 工单选择回调函数
        window.selectWorkOrderCallback = function(workOrderData) {
            if(workOrderData) {
                // 只填充工单编码
                $('input[name="OrderCode"]').val(workOrderData.workOrderCode || '');

                // 提示选择成功
                layer.msg('工单选择成功', {icon: 1});
            }
        };

        // 关闭弹窗
        window.closeDialog = function() {
            var index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
        };
    });
</script>
